<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title>Document</title>
	<script type="text/javascript" src='./js/jquery-1.7.2.min.js'></script>
	<script type="text/javascript" src='./js/extend.js'></script>
	<link rel="stylesheet" href="./css/inc.css" />
	<link rel="stylesheet" href="./css/ico.css" />
</head>
<body>
	<div class="Menu">				
		<a href="" class='act'>基本列表</a>
		<a href="">添加文章</a>
		<a href="">更新缓存</a>
		<a href="" id='a'>弹窗层</a>
		<script type="text/javascript">
			$(function(){
				$('#a').click(function(){
					$.msg({
						str:'欢迎使用：LDF简单弹出消息窗口！关闭后会自动弹出回调', //默认内容
					 	timeout:10, //关闭时间
					 	shade:1, //是否有遮罩
					 	closebtn:1, //是否显示关闭按钮
					 	close:function(){
					 		$.msg();
					 	} //回调函数
					});
					return false;
				})
			})
		</script>
	</div>
	<div class="tabMenu">
		<a href="" class='act'>小图标</a>
		<a href="">表单</a>
		<a href="">按钮</a>
		<a href="">表格与分页</a>
	</div>
	<ul class="tabSub">
		<li class="act">
			<p class="p10 fm"><a href="" class="changeico btn bgorange f16">放大图标</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icolist"><c></i>列表</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icown"><c></i>警告</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icorepeat"><c></i>平铺</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icoopen"><c></i>打开</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icocopy"><c></i>复制</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icoshare"><c></i>分享</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icomsg"><c></i>消息</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icodown"><c></i>下载</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icosend"><c></i>发送</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icouser"><c></i>用户</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icolock"><c></i>锁定</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icounlock"><c></i>解锁</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icorecyle"><c></i>删除</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icoedit"><c></i>编辑</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icom"><c></i>更多</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icosearch"><c></i>搜索</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icot"><c></i>上箭</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icor"><c></i>右箭</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icob"><c></i>下箭</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icol"><c></i>左箭</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icoindex"><c></i>首页</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icoyes"><c></i>正确</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icono"><c></i>错误</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icoask"><c></i>问号</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icoadd"><c></i>加号</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icodec"><c></i>减号</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icotime"><c></i>时间</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icogoods"><c></i>商品</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icomail"><c></i>信件</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icopic"><c></i>图片</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icostar"><c></i>星星</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icoset"><c></i>设置</a></p>
			<p class="dib mr5"><a href='' class=''><i class=" mr3 ico icobrand"><c></i>品牌</a></p>
		</li>
		<li>
			<form action="" class="form">
				<table class='bdc pct100'>
					<tr><td class="p5"><input type="text" /></td></tr>
					<tr><td class="p5"><input type="radio" />单选<input type="radio" />单选</td></tr>
					<tr><td class="p5"><input type="checkbox" />多选<input type="checkbox" />多选<input type="checkbox" />多选</td></tr>
					<tr>
						<td class="p5">
							<textarea name="" id="" cols="80" rows="5"></textarea>
						</td>
					</tr>
					<tr>
						<td class="p5">
							<select name="" id="">
								<option value="">下拉列表</option>
								<option value="">下拉列表</option>
								<option value="">下拉列表</option>
							</select>
						</td>
					</tr>
					<tr>
						<td class="p5">
							<fieldset>
								<legend>上传图片</legend>
								<input type="file" />
							</fieldset>
						</td>
					</tr>
					<tr>
						<td class="p5">
							<input type="submit" />
						</td>
					</tr>
				</table>
			</form>
		</li>
		<li>
			<table class="table ">
				<tr>
					<th>按钮管理系统</th>
				</tr>
				<tr>
					<td>
						<a href="" class="btn bgred mr5 mt5">按钮展示</a>
						<a href="" class="btn bgyellow4 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgblue mr5 mt5">按钮展示</a>
						<a href="" class="btn bggreen mr5 mt5">按钮展示</a>
						<a href="" class="btn bgpurple mr5 mt5">按钮展示</a>
						<a href="" class="btn bgorange mr5 mt5">按钮展示</a>
						<a href="" class="btn bgteal mr5 mt5">按钮展示</a>
						<a href="" class="btn bggray mr5 mt5">按钮展示</a>
						<a href="" class="btn bgblack mr5 mt5">按钮展示</a>
						<a href="" class="btn bgmaroon mr5 mt5">按钮展示</a>
					</td>
				</tr>
				<tr>
					<td>
						<a href="" class="btn bgc mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc1 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc2 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc3 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc4 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc5 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc6 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc7 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc8 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc9 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-1 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-2 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-3 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-4 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-5 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-6 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-7 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-8 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgc-9 mr5 mt5">按钮展示</a>
					</td>
				</tr>
				<tr>
					<td>
						<a href="" class="btn bgred1 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgred5 mr5 mt5">按钮展示</a>
						<a href="" class="btn bggreen2 mr5 mt5">按钮展示</a>
						<a href="" class="btn bggreen-2 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgblue-3 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgblue3 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgteal3 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgteal-3 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgmaroon2 mr5 mt5">按钮展示</a>
						<a href="" class="btn bgmaroon-2 mr5 mt5">按钮展示</a>
					</td>
				</tr>
				<tr>
					<td class='fm'>
						<a href="" class="btn bgred1 mr5 mt5 f14">按钮展示</a>
						<a href="" class="btn bgred5 mr5 mt5 f16">按钮展示</a>
						<a href="" class="btn bggreen2 mr5 mt5 f18">按钮展示</a>
						<a href="" class="btn bggreen-2 mr5 mt5 f20">按钮展示</a>
						<a href="" class="btn bgblue-3 mr5 mt5 f22">按钮展示</a>
						<a href="" class="btn bgblue3 mr5 mt5 f24">按钮展示</a>
						<a href="" class="btn bgteal3 mr5 mt5 f26">按钮展示</a>
						<a href="" class="btn bgteal-3 mr5 mt5 f28">按钮展示</a>
						<a href="" class="btn bgmaroon2 mr5 mt5 f30">按钮展示</a>
						<a href="" class="btn bgmaroon-2 mr5 mt5 f32">按钮展示</a>
					</td>
				</tr>
			</table>	
		</li>
		<li>
			<div class="p10">
				<div class="fm ">
					<a href="" class="dels bgred-2 f14 white p5 dib">删除所选</a>
				</div>
				<table class="table">
					<tr>
						<th class='tc pct5'><input type="checkbox" id='checkAll' /></th>
						<th class='tc pct5'>id1</th>
						<th class='tc pct5'>图片</th>
						<th class='tc'>name</th>
						<th class='tc'>操作</th>
					</tr>
					<tr>
						<td class='tc'><input type="checkbox" /></td>
						<td class='tc'>1</td>
						<td class='tc'><div class="showPic w50"><img src="img/logo.jpg" height='50' /></div></td>
						<td class='tc'>名称</td>
						<td class='tc'>修改 <a href="" class="dels btn bgred2">删除</a></td>
					</tr>
					<tr>
						<td class='tc'><input type="checkbox" /></td>
						<td class='tc'>2</td>
						<td class='tc'><div class="showPic w50"><img src="img/logo.jpg" height='50' /></div></td>
						<td class='tc'>名称</td>
						<td class='tc'>修改 <a href="" class="dels btn bgred2">删除</a></td>
					</tr>
					<tr>
						<td class='tc'><input type="checkbox" /></td>
						<td class='tc'>3</td>
						<td class='tc'><div class="showPic w50"><img src="img/logo.jpg" height='50' /></div></td>
						<td class='tc'>名称</td>
						<td class='tc'>修改 <a href="" class="dels btn bgred2">删除</a></td>
					</tr>
					
				</table>
				
				<div class="page">
					<span>上一页</span>
					<a href="">1</a>
					<span href="" class="act">2</span>
					<a href="">3</a>
					<a href="">下一页</a>
				</div>
			</div>
		</li>
	</ul>

</body>
</html>
